<template>
	<view class="login-bg">
		<view class="login-view">
			<view class="fontSize-30 color-000 margin-bottom30">
				修改密码
			</view>
			<view class="fontSize-15 color-000 margin-bottom30">请输入您的原密码</view>
			<view class="flex-justAliCenter-column margin-bottom50">
				<view class="input-view margin-bottom50">
					<input type="text" v-model="password_old" placeholder-style="color:#999999;"
						placeholder="输入原有密码" />
				</view>

				<view class="input-view margin-bottom50">
					<input type="text" v-model="password" placeholder-style="color:#999999;"
						placeholder="设置新密码" />
				</view>
				<view class="input-view margin-bottom50">
					<input type="text" v-model="password_true" placeholder-style="color:#999999;"
						placeholder="确认新密码" />
				</view>
				<view class="login-btn-view flex-center margin-bottom50" @click="submitLogin">完成</view>

				<view class="flex-center">
					<!-- <view class="fontSize-15 color-fff" @click="gotoCodeLogin()">验证码登录</view>
					<view class="login-icon"></view> -->
					<view class="fontSize-15" style="color: #2A9C37;" @click="goToRegister">忘记原有密码？</view>
				</view>
				<!-- 隐私协议 -->
				<!-- <view class="flex-alignItems-center margin-top50">
					<view class="margin-right20" @click="handleSelect">
						<image class="img-38" v-if="isSelect" src="../../static/images/checked.png" mode=""></image>
						<image class="img-38" v-else src="../../static/images/check.png" mode=""></image>
					</view>
					<view class="fontSize-15 color-999">
						我已阅读并同意 
						<text style="color: #2A9C37;" @click="gotoUrl('用户协议')">《用户协议》</text>
						和 
						<text style="color: #2A9C37;" @click="gotoUrl('隐私政策')">《隐私政策》</text>
					</view>
				</view> -->
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				password_old: '', // 原密码
				password: '', // 密码
				password_true: '', // 确认密码
				isSelect: false, // 是否已阅读
				tips: '获取验证码'
			}
		},
		methods: {
			codeChange(text) {
				this.tips = text;
			},
			getCode() {
				if (this.$refs.uCode.canGetCode) {
					// 模拟向后端请求验证码
					uni.showLoading({
						title: '正在获取验证码'
					})
					setTimeout(() => {
						uni.hideLoading();
						let parmar = {
							mobile: this.mobile,
							event: 'login'
						}
						this.$api.verification(parmar).then(res => {
							if (res.code === 1) {
								// 这里此提示会被this.start()方法中的提示覆盖
								uni.$u.toast('验证码已发送');
								// 通知验证码组件内部开始倒计时
								this.$refs.uCode.start();
							}
						})
					}, 2000);
				} else {
					uni.$u.toast('倒计时结束后再发送');
				}
			},
			end() {
				uni.$u.toast('倒计时结束');
			},
			start() {
				uni.$u.toast('倒计时开始');
			},
			goToRegister() {
				this.$tools.navigateTo('/pages/login/forgot-password')
			},
			// 选择选中
			handleSelect() {
				this.isSelect = !this.isSelect
			},
			// 提交登录
			async submitLogin() {
				if (!this.password_old) {
					return this.$tools.toast('请输入原密码')
				}
				if (!this.password) {
					return this.$tools.toast('请输入登录密码')
				}
				if (!this.password_true) {
					return this.$tools.toast('请输入确认密码')
				}
				if (this.password !== this.password_true) {
					return this.$tools.toast('登录密码不一致')
				}
				let res = await this.$http.post(this.$api.change_password, {
					password_old: this.password_old,
					password: this.password,
					password_true: this.password_true
				},{token:true})
				if (res.code == 1) {
					this.$tools.toast('修改成功')
					this.$tools.reLaunch('/pages/login/login')
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.login-icon {
		width: 2px;
		height: 30rpx;
		background-color: #54B095;
		margin: 0 30rpx;
	}

	.login-view {
		position: absolute;
		bottom: 400rpx;
		left: 50rpx;
	}

	.login-btn-view {
		width: 600rpx;
		background-color: #2A9C37;
		padding: 30rpx;
		border-radius: 50rpx;
		color: #ffffff;
		font-size: 15px;
	}

	.input-view {
		width: 600rpx;
		background-color: #F7F7F7;
		padding: 30rpx;
		font-size: 15px;
		border-radius: 50rpx;
		color: #999999;
		// border: 1px solid #54B095;
	}

	.login-bg {
		width: 100%;
		height: 100vh;
		overflow: hidden;
		background-color: #ffffff;
		// background: url("../../static/image/login-bg.png") no-repeat;
		// background-size: 100% 100%;
	}
</style>